<template>
  <div class="box1">
    <img :src="discuss.avatar" alt="123" />
    <div class="appraise">
      <p class="first">
        <span>{{ discuss.username }}</span
        ><span>{{ time }}</span>
      </p>
      <p class="Props">
        <van-rate
          allow-half
          color="#f9d41e"
          size="20px"
          count="5"
          v-model="discuss.score"
        />
        <span>{{ discuss.deliveryTime }}分钟送达</span>
      </p>
      <p>{{ discuss.text }}</p>
    </div>
  </div>
</template>

<script>
import { gettime } from "@/utils/tool/tool";
export default {
  props: ["discuss"],
  data() {
    return {
      time: "",
    };
  },
  created() {
    this.time = gettime(this.discuss.rateTime);
  },
};
</script>

<style lang="less" scoped>
.box1 {
  width: 90%;
  margin: 15px auto;
  display: flex;
  border-bottom: 1px solid #d2d2d2;
  img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
  }
  .appraise {
    flex: 1;
    margin-left: 10px;
    background-color: #fff;
    line-height: 30px;
    .first {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
    }
    .Props {
      display: flex;
      align-items: center;
      span {
        font-size: 14px;
        color: #d1d1d1;
      }
    }
  }
}
</style>